<!DOCTYPE html>
<html lang="zh">
<head>
  <th:block th:include="include :: header('基本表单')"/>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
  <div class="row">
    <div class="col-sm-12">
      <form class="form-horizontal" id="generator-form">
        <div class="form-group">
          <label class="col-sm-3 control-label">生成表信息: </label>
          <label class="col-sm-8 control-label" th:text="${#strings.listJoin(tableNames,',')}"></label>
        </div>
        <div class="form-group">
          <label class="col-sm-3 control-label">生成方案: </label>
          <div class="col-sm-8">
            <select class="form-control" name="projectId" id="projectInfo">
              <option value="">--请选择开发语言--</option>
              <option th:each="item : ${projects}" th:attr="data=${item}" th:value="${item.id}"
                      th:text="${item.name}"></option>
            </select>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>
<th:block th:include="include :: footer"/>

<script type="text/javascript" th:inline="javascript">
    var prefix = ctx + "gen/generator";

    function submitHandler() {
        var data = $("#generator-form").serializeObject();
        data.tableIds = [[${tableIds}]];
        // 下载
        if (data.generatorType == 0) {
            var xhr = new XMLHttpRequest();
            xhr.open('post', prefix + "/download", true); 		//POST的格式相对比较灵活，参数可以有比较多的形式，例如JSON，表单FORM等
            xhr.responseType = "blob";    // 返回类型blob
            xhr.setRequestHeader("Content-Type","application/json");//提交的数据为json格式

            // 定义请求完成的处理函数
            xhr.onload = function () {
                // 请求完成
                if (this.status === 200) {
                    var disposition = xhr.getResponseHeader("Content-Disposition");
                    console.log(disposition);
                    var filename = disposition.split(';')[1].split('=')[1];
                    console.log(filename);
                    // 返回200
                    var blob = this.response;
                    var reader = new FileReader();
                    reader.readAsDataURL(blob);    // 转换为base64，可以直接放入a表情href
                    reader.onload = function (e) {
                        // 转换完成，创建一个a标签用于下载
                        var a = document.createElement('a');
                        a.download = filename;
                        a.href = e.target.result;
                        $("body").append(a);    // 修复firefox中无法触发click
                        a.click();
                        $(a).remove();
                    }
                }
            };

            // 发送ajax请求,案例中我们使用POST的请求格式，参数类型为JSON
            xhr.send(JSON.stringify(data));
        } else {
            $.ajax({
                cache: true,
                type: "POST",
                url: prefix + "/code",
                contentType: "application/json;charset=utf-8",
                data: JSON.stringify(data),
                async: false,
                error: function (req) {
                    console.log(req);
                    $.modal.alertError("系统错误");
                },
                success: function (data) {
                    $.operate.successCallback(data);
                }
            });
        }
    }

    function projectInfoShow(project) {
        $("#email").text(project.email);
        $("#pkgName").text(project.pkgName);
        $("#modelName").text(project.modelName);
        $("#templatePath").text(project.templatePath);
        $("#version").text(project.version);
        $("#genType").text(project.genType);
        $("#outPath").text(project.outPath);
    }

    $('#projectInfo').on('change', function(event){
        var $selected = $(this).find("option:selected");
        var project = $selected.attr("data");
        //projectInfoShow(JSON.pass(project));
        //projectInfoShow(JSON.stringify(project));
    });

</script>

</body>
</html>
